<template>
  <view class="main_box">
    <custom-navbar @back="goBack" :immersive="true"></custom-navbar>
    <view class="main_box-content">
      <view class="main_box-content-title"> 修改密码 </view>

      <view class="main_box-content-form">
        <input
          placeholder="旧密码"
          type="password"
          v-model="pass"
          :password="true"
        />
        <input
          placeholder="新的密码"
          type="password"
          v-model="passs"
          :password="true"
        />
        <input
          placeholder="确认密码"
          type="password"
          v-model="passss"
          :password="true"
        />
      </view>
      <view class="main_box-content-submit_btn" @click="save"> 更改密码 </view>
    </view>
  </view>
</template>

<script>
import jsencrypt from "@/js_sdk/jsencrypt-Rsa/jsencrypt/jsencrypt.vue";
// 密钥对生成 http://web.chacuo.net/netrsakeypair

const publiukey =
  "MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBANL378k3RiZHWx5AfJqdH9xRNBmD9wGD\n" +
  "2iRe41HdTNF8RUhNnHit5NpMNtGL0NPTSSpPjjI1kJfVorRvaQerUgkCAwEAAQ==";

import { updatePass } from "../../api/public.js";
export default {
  data() {
    return {
      pass: "",
      passs: "",
      passss: "",
      pubblicData: "",
      pubblicDatas: "",
    };
  },
  onLoad() {
    console.log(this.$refs.message_text);
  },
  methods: {
    goBack() {
      uni.navigateBack({
        delta: 1, // 返回的页面数，如果delta大于现有页面数，则返回到首页
      });
    },
    toDetail() {
      uni.navigateTo({
        url: "../modifypass/index",
      });
    },
    save: function () {
      let that = this;
      if (!that.pass) {
        uni.showToast({
          title: "请输入旧密码",
          icon: "none",
          duration: 2000,
        });
        return;
      }
      if (!that.passs) {
        uni.showToast({
          title: "请输入新密码",
          icon: "none",
          duration: 2000,
        });
      }

      if (that.passs != this.passss) {
        uni.showToast({
          title: "请确认密码一致",
          icon: "none",
          duration: 2000,
        });
        return;
      }

      this.pubblicData = jsencrypt.setEncrypt(publiukey, that.passss);
      this.pubblicDatas = jsencrypt.setEncrypt(publiukey, that.pass);
      updatePass({
        newPass: this.pubblicData,
        oldPass: this.pubblicDatas,
      })
        .then((res) => {
          if (res.status != 400) {
            uni.showToast({
              title: "修改成功",
              icon: "none", //不要图标
              duration: 2000, //1后消失
            });
            this.$store.commit("LOGOUT");
            uni.navigateTo({
              url: "../login/index",
            });
          } else {
            uni.showToast({
              title: res.message,
              icon: "none", //不要图标
              duration: 3000, //1后消失
            });
          }
        })
        .catch((e) => {
          uni.showToast({
            title: e.msg,
            icon: "none", //不要图标
            duration: 3000, //1后消失
          });
        });
    },
  },
};
</script>

<style lang="scss">
.main_box {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  padding-top: 30%;
  align-items: center;
  background-image: url("http://129.211.211.126/download/loginBg.png");
  background-size: cover;
  background-repeat: repeat;
  &-content {
    width: 650rpx;
    &-title {
      margin-top: 30rpx;
      font-size: 60rpx;
      height: 100rpx;
      color: #333333;
    }
    &-tip {
      font-size: 28rpx;
      color: #333333;
      font-weight: lighter;
    }
    &-form {
      margin-top: 50rpx;
      input {
        background: white;
        height: 90rpx;
        width: 100%;
        border-radius: 30rpx;
        margin-bottom: 30rpx;
        padding-left: 30rpx;
      }
    }

    &-submit_btn {
      background: #9db6f3;
      display: flex;
      align-items: center;
      justify-content: center;
      color: white;
      height: 90rpx;
      border-radius: 40rpx;
    }
  }
}
</style>
